<html>
    <head>

        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">

        <style type="text/css">

            td,th{
                text-align: center;
            }
    
            body
                {
                    background-color:white;
                }
            span
                {
                    float: left;
                    margin-left: 50px;
                    margin-top: 50px;
                    width: 220px;
                    height: 480px;
                    border: 1px solid blue;
                }
            a:link
                {
                    color:black;
                    font-size: 30px;
                    font-family: Arial;
                }
            a:hover
                {
                    color: red;
                }
            a
                {
                    margin-left: 20px;
                }
            .first
                {
                    width: 1200px;
                    height: 550px;
                    border: 1px solid red;
                    margin-left: 300px;
                    margin-top: 34px;
                    padding-left: 20px;
                }
            p
                {
                    color: navy;
                    font-size: 25px;
                    font-family: Arial;
                }
        </style>
    </head>
    <body>
        <h1 style="text-align:center;">超市订单管理系统 </h1>
        <div>

            <span>
                <br><br><a href="manage.html">订单管理</a><br><br><br><br>
                <a href="input.html">订单信息录入</a><br><br><br><br>
                <a href="modify.html">订单信息修改</a><br><br><br><br>
                <a href="history.html">全部订单</a><br>
            </span>
        </div>
        <div class="first">
            <h1 align="center">订单信息录入</h1><br><br>
            <div align="center">
                <form class="form-inline">
        
                    <div class="form-group">
                        <label>订单名字</label>
                        <input id="name" type="text" class="form-control" required pattern="^[A-Za-z]+$">
                    </div><br><br>
        
                    <div class="form-group">
                        <label>订单ID</label>
                        <input id="ID" type="telephone" class="form-control" required pattern="^\d{7}$">
                    </div><br><br>

                    <div class="form-group">
                        <label>价格</label>
                        <input id="price" type="telephone" class="form-control" required pattern="^[0-9]*[1-9][0-9]*$">
                    </div><br><br>

                    <div class="form-group">
                        <label>时间</label>
                        <input id="time" type="telephone" class="form-control" required pattern="^\d{8}$">
                    </div><br><br>
        
                    <div class="form-group">
                        <label>订单状态</label>
                        <select id="group" class="form-control" placeholder="请选择">
                            <option value="0" > 请选择 </option>
                            <option value="1">  Y </option>
                            <option value="2">  N </option>
                      </select>
                    </div><br><br>
        
                    <button type="button" class="btn btn-primary" onclick="ischeck();">导入</button>
                    <button type="submit" class="btn btn-warning">重置</button>
        
                </form>
            </div>
    </body>
</html>
<script>
    function get(){
        alert(document.getElementById("name").value);
    }
    
    function ischeck(){
        var val1 = document.getElementById("name").value
        var reg1 = /^[A-Za-z]+$/
        var val2 = document.getElementById("ID").value
        var reg2 = /^\d{7}$/
        var val3 = document.getElementById("price").value
        var reg3 = /^[0-9]*[1-9][0-9]*$/
        var val4 = document.getElementById("time").value
        var reg4 = /^\d{8}$/
        if(reg1.test(val1)&&reg2.test(val2)&&reg3.test(val3)&&reg4.test(val4)){
            window.location.href = 'manage.html';
        }else{
            alert("请输入正确格式！");
        }
    }

</script>